<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@page import="com.liuya.safe.policy.handler.QueryRawHandler" %>
<%@page import="com.liuya.db.sql.xml.QueryType" %>
<%@page import="com.liuya.db.sql.xml.RawSQL" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<%@ include file="../../common/taglib.jsp" %>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link rel="shortcut icon" href="${contextPath}/style/def/favicon.ico">
    <%@ include file="../../common/static.jsp" %>

    <link rel="stylesheet" type="text/css" media="screen"
          href="${contextPath}/style/def/css/jTreeTheme/classic/style.css"/>

    <%
        I18N i18n = I18N.getWebInstance(request);
        QueryRawHandler handler = (QueryRawHandler) request.getAttribute("handler");
        QueryType query = handler.getQuery();
        RawSQL raw = query.getRawSQL();
        String id = request.getParameter("id");

        String[] mainMenuHrefs = new String[]{
                "returnMain.do?oper=return&id=" + id
        };
        String[] mainMenuTexts = new String[]{
                i18n.say("Query")
        };
        String[] subMenuHrefs = new String[]{
                "javascript:savePolicy();",
                "/queryTest/testPolicy.do?id=" + id,
                "/queryDesign/editPolicy.do?id=" + id
        };
        String[] subMenuTexts = new String[]{
                i18n.say("Save"),
                i18n.say("Test"),
                i18n.say("Goto_design_mode")
        };

        request.setAttribute("mainMenuHrefs", mainMenuHrefs);
        request.setAttribute("mainMenuTexts", mainMenuTexts);
        request.setAttribute("subMenuHrefs", subMenuHrefs);
        request.setAttribute("subMenuTexts", subMenuTexts);
    %>
    <title><%=i18n.say("Manual_Query")%> -- <%=query.getName() %>
    </title>
</head>
<body>
<jsp:include page="../../common/header.jsp"></jsp:include>
<%@include file="../../common/menu.jsp" %>


<div id="sql" class="smallContainer">
    <label><%=i18n.say("SQL")%>
    </label>
    <textarea rows="7" cols="71" name="rawSql" id="rawSql"><%=raw.getContent()%></textarea><br/>
    <input type="button" value="OK" onclick="javascript:setRawSql()"/>
</div>
<!-- 设置参数 -->
<div id="param" class="smallContainer">
</div>
<!-- 设置映射javabean -->
<div id="mapping" class="smallContainer">
</div>
<!-- 添加参数 -->
<div id="paramDialog" title="Add/Edit parameter">
    <form id="paramForm" method="post" action="addParam.do?id=<%=id %>">
    </form>
</div>
<!-- 添加映射属性 -->
<div id="propertyDialog" title="Add/Edit property">
    <form id="propertyForm" method="post" action="addProperty.do?id=<%=id %>">
    </form>
</div>

<jsp:include page="../../common/footer.jsp"></jsp:include>
<script>

    jQuery(document).ready(function () {
        jQuery("#param").load("param.do?oper=param&id=<%=id%>");
        jQuery("#mapping").load("mapping.do?oper=mapping&id=<%=id%>");

        //--- param dialog and form
        // dialog
        jQuery("#paramDialog").dialog({
            autoOpen: false,
            modal: true,
            hide: "fadeOut",
            position: 'middle',
            buttons: {
                "OK": function () {
                    jQuery('#paramForm').submit();
                }
            }
        });

        var paraFormOptions = {
            beforeSubmit: checkParamForm,
            success: afterUpdateParamForm
        };

        jQuery('#paramForm').submit(function () {
            jQuery(this).ajaxSubmit(paraFormOptions);
            return false;
        });

        //--- property dialog and form
        // dialog
        jQuery("#propertyDialog").dialog({
            autoOpen: false,
            modal: true,
            hide: "fadeOut",
            position: 'middle',
            buttons: {
                "OK": function () {
                    jQuery('#propertyForm').submit();
                }
            }
        });

        var propertyFormOptions = {
            beforeSubmit: checkPropertyForm,
            success: afterUpdatePropertyForm
        };

        jQuery('#propertyForm').submit(function () {
            jQuery(this).ajaxSubmit(propertyFormOptions);
            return false;
        });


    });

    function setRawSql() {
        var rawSql = jQuery("#rawSql").attr("value");

        jQuery.ajax({
            url: 'setRawSql.do?oper=setRawSql',
            type: 'POST',
            data: {"id": "<%=id%>", "rawSql": rawSql},
            error: function () {
                alert('Error set raw sql');
            },
            success: function (xml) {
                //jQuery( "#select-tab" ).load( "?oper=designTables&id=<%=id%>" );
            }
        });
    }

    function setMappingClass() {
        var mappingClass = jQuery("#mappingClass").attr("value");

        jQuery.ajax({
            url: 'setMappingClass.do?oper=setMappingClass',
            type: 'POST',
            data: {"id": "<%=id%>", "mappingClass": mappingClass},
            error: function () {
                alert('Error mapping class');
            },
            success: function (xml) {
                //jQuery( "#select-tab" ).load( "?oper=designTables&id=<%=id%>" );
            }
        });
    }

    //-------- param functions
    function addParam() {
        $("#paramForm").attr("action", "addParam.do?id=<%=id%>");
        jQuery("#paramForm").load("preEditParam.do?oper=editParam&id=<%=id%>",
                function () {
                    jQuery("#paramDialog").dialog("open");
                });
    }

    function checkParamForm() {

    }

    function afterUpdateParamForm() {
        jQuery("#paramDialog").dialog("close");
        jQuery("#param").load("param.do?oper=param&id=<%=id%>");
    }

    function editParam(index) {
        $("#paramForm").attr("action", "editParam.do?id=<%=id%>&index=" + index);
        jQuery("#paramForm").load("preEditParam.do?oper=editParam&id=<%=id%>&index=" + index,
                function () {
                    jQuery("#paramDialog").dialog("open");
                });
    }

    function moveParam(direct, index) {
        jQuery.ajax({
            url: 'moveParam.do?oper=moveParam',
            type: 'POST',
            async: false,
            data: {"id": "<%=id%>", "index": index, "direct": direct},
            error: function () {
                alert('Error move parameter');
            },
            success: function (xml) {
                jQuery("#param").load("param.do?oper=param&id=<%=id%>");
            }
        });
    }

    function deleteParam(index) {
        jQuery.ajax({
            url: 'deleteParam.do?oper=deleteParam',
            type: 'POST',
            async: false,
            data: {"id": "<%=id%>", "index": index},
            error: function () {
                alert('Error delete parameter');
            },
            success: function (xml) {
                jQuery("#param").load("param.do?oper=param&id=<%=id%>");
            }
        });
    }

    //-------- property functions
    function addProperty() {
        $("#propertyForm").attr( "action", "addProperty.do?id=<%=id %>");
        jQuery("#propertyForm").load("preEditProperty.do?oper=editProperty&id=<%=id%>",
                function () {
                    jQuery("#propertyDialog").dialog("open");
                });
    }

    function checkPropertyForm() {

    }

    function afterUpdatePropertyForm() {
        jQuery("#propertyDialog").dialog("close");
        jQuery("#mapping").load("mapping.do?oper=mapping&id=<%=id%>");
    }

    function editProperty(index) {
        $("#propertyForm").attr("action", "editProperty.do?id=<%=id%>&index=" + index);
        jQuery("#propertyForm").load("preEditProperty.do?oper=editProperty&id=<%=id%>&index=" + index,
                function () {
                    jQuery("#propertyDialog").dialog("open");
                });
    }

    function moveProperty(direct, index) {
        jQuery.ajax({
            url: 'moveProperty.do?oper=moveProperty',
            type: 'POST',
            async: false,
            data: {"id": "<%=id%>", "index": index, "direct": direct},
            error: function () {
                alert('Error move property');
            },
            success: function (xml) {
                jQuery("#mapping").load("mapping.do?oper=mapping&id=<%=id%>");
            }
        });
    }

    function deleteProperty(index) {
        jQuery.ajax({
            url: 'deleteProperty.do?oper=deleteProperty',
            type: 'POST',
            async: false,
            data: {"id": "<%=id%>", "index": index},
            error: function () {
                alert('Error delete property');
            },
            success: function (xml) {
                jQuery("#mapping").load("mapping.do?oper=mapping&id=<%=id%>");
            }
        });
    }

    function savePolicy() {
        jQuery.ajax({
            url: 'save.do?oper=save',
            type: 'POST',
            data: {"id": "<%=id%>"},
            error: function () {
                alert('Error save policy');
            },
            success: function (xml) {
                alert("<%=i18n.say( "saved" )%>");
            }
        });
    }
</script>
</body>
</html>